<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta name="viewport" content="width=device-width" />
    <title>login</title>
<!--    <link rel="bookmark" type="image/ico" href="favicon.ico" />-->
    <link rel="stylesheet" th:href="@{layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{css/login.css}"  />
</head>

<body>
    <div class="elight-product-box animated fadeInUp">
        <h2>登陆界面</h2>
        <ul class="product-desc">
            <li>守卫安全</li>
            <li>服务民生</li>
        </ul>
        <div class="product-btns">
            <a class="layui-btn layui-btn-normal layui-btn-small" target="_blank" href="http://www.byzoro.com/">
                <i class="layui-icon">&#xe609;</i>&nbsp;百卓网络</a>
        </div>
    </div>
    <div class="elight-login-box animated fadeInRight">
        <div class="elight-login-header">登陆界面</div>
        <div class="elight-login-body">
            <form class="layui-form" lay-filter="form_login">
                <div class="layui-form-item">
                    <label class="login-icon"><i class="layui-icon">&#xe612;</i></label>
                    <input type="text" name="name" autocomplete="off" placeholder="账号/已认证邮箱" class="layui-input">
                </div>
                <div class="layui-form-item">
                    <label class="login-icon">
                        <i class="layui-icon">&#xe642;</i>
                    </label>
                    <input type="password" name="password" autocomplete="off" placeholder="登陆密码" class="layui-input">
                </div>
                <div class="layui-form-item">
                    <input class="elight-pull-right" type="checkbox" lay-skin="primary" lay-filter="remember_user" name="isSaveAccount" title="记住密码" />
                </div>
                <div class="layui-form-item">
                    <button class="layui-btn btn-submit" lay-submit lay-filter="login">立即登录</button>
                </div>
            </form>
        </div>
        <div class="elight-login-fooder"></div>
    </div>
</body>
<script type="text/javascript" th:src="@{layui/layui.js}"></script>
<script>
    layui.use(['layer', 'form'], function() {
        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;
        if (localStorage.getItem('remember_user')) {
            user = JSON.parse(localStorage.getItem('remember_user'))
            $("input[type=checkbox]").attr("checked", "checked")
            $("input[name=name]").val(user.name)
            $("input[name=password]").val(user.password)
            form.render('checkbox', 'form_login')
        }
        form.on('checkbox(remember_user)', function(data){
            if (data.elem.checked) {
                $("input[type=checkbox]").attr("checked", "checked")
            } else {
                $("input[type=checkbox]").removeAttr('checked')
            }
        });
        form.on('submit(login)', function(data) {
            formData = data.field;
            if (formData.name == '') {
                layer.msg('用户名不能为空', {icon: 5});
                return false;
            }
            if (formData.password == '') {
                layer.msg('密码不能为空', {icon: 5});
                return false;
            }
            $(".btn-submit").html("正在登录...");
            $(".btn-submit").attr('disabled', true).addClass('layui-disabled');
            $.ajax({
                type : "post",
                url : "/api/login",
                dataType: "json",
                data:JSON.stringify(formData),
                contentType: "application/json",
                complete:function () {
                    $(".btn-submit").html("立即登录");
                    $(".btn-submit").attr('disabled', false).removeClass('layui-disabled');
                },
                success:function (rs) {
                    if (rs.code != 200) {
                        layer.msg(rs.message, {icon: 5});
                        return false;
                    } else {
                        layer.msg(rs.message, {icon: 6});
                        if (formData.isSaveAccount == "on") {
                            localStorage.setItem('remember_user', JSON.stringify(rs.data))
                        } else {
                            localStorage.removeItem('remember_user')
                        }
                        sessionStorage.setItem('remember_user', JSON.stringify(rs.data))
                        window.location.href = 'index'
                    }
                }
            })
        });
    });
</script>

</html>